import { defineStore } from 'pinia'
import { useUserStore } from './user'

export const useStore = defineStore('main', {
  state: () => {
    return {
      count: 1,
      users: [
        {
          id: 1
        },
        {
          id: 2
        }
      ]
    }
  },
  // Getter 完全等同于 Store 状态的计算值，可以用 defineStore() 中的 getters 属性定义，接收状态作为第一个参数以鼓励箭头函数的使用
  getters: {
    doubleCount: (state) => state.count * 2,
    doublePlusOne() { // 定义常规函数时通过 this 访问到整个 store 的实例
      // console.log(this.doubleCount)
      return this.count * 2 + 1
    },
    // 通过 this 访问其他 getter
    doubleCountPlusOne() {
      return this.doubleCount + 4
    },
    // 将参数传递给 getter：Getters 只是幕后的 computed 属性，无法向它们传递任何参数，可以从 getter 返回一个函数以接手任何参数
    getUserById: (state) => {
      return (userId) => state.users.find((user) => user.id === userId)
    },
    // 访问其他 store 的 getter
    otherGetter(state) {
      const otherStore = useUserStore()
      return state.count + otherStore.getInit
    }
  },
  // Actions 相当于组件中的 methods。可以使用 defineStore() 中的 actions 属性定义，它们非常适合业务逻辑。同时 actions 可以是异步的
  actions: {
    increment() {
      this.count++
      if (this.count === 5) {
        throw new Error('我等于5啦')
      }
    },
    remove() {
      this.count = this.count - 1
    },
    // 要使用另一个 store，可以直接在操作内部使用它
    getUserName() {
      const user = useUserStore()
      return user.name
    }
  }
})